import { Component, Input, Output, EventEmitter } from '@angular/core';
import { ChatMessageItem } from '../../pages/chat/entity/chat.entity';
import { Observable } from 'rxjs/Observable';
import 'rxjs';

@Component({
  selector: 'chat-message',
  templateUrl: 'chat-message.html'
})
export class ChatMessageComponent {

  @Input()
  public messageItem: ChatMessageItem;
  @Output()
  public completeEmitter = new EventEmitter<boolean>()

  public messages: string[] = [];
  public isQuestion: boolean = true;

  constructor() {
    console.log('Hello ChatMessageComponent Component');
  }

  ngOnInit() {
    if (this.messageItem.nextStep) {
      this.isQuestion = false;
    }
    Observable.interval(600)
      .take(this.messageItem.contents.length)
      .map(index => this.messageItem.contents[index])
      .subscribe(
        message => {
          // console.log(message);
          this.messages.push(message);
        },
        (error) => {
          console.log('---error---');
        },
        () => {
          console.log('---complete---');
          window.setTimeout(() => {
            this.completeEmitter.emit(this.isQuestion);
          }, 1200);
        }
      );
  }
}
